<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>个人中心</title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/style.css" rel="stylesheet" />

		<style>
			.orderNav li{
				width: 20%;
			}
			.mui-page .mui-table-view:first-child {
				margin-top: 15px;
			}
			.mui-page .mui-table-view:last-child {
				margin-bottom: 30px;
			}
			.mui-table-view {
				margin-top: 10px;
			}
			.table-view-combine:after {
				height: 0;
			}
			.mui-table-view span.mui-pull-right {
				color: #999;
			}
			.mui-grid-view.mui-grid-9{ background-color: #fff; margin: 0;}
			.mui-grid-view.mui-grid-9:after{ position: absolute; display: block;}
			.mui-grid-view.mui-grid-9 .mui-table-view-cell{padding: 0; border: 0;}
			.mui-grid-view.mui-grid-9 .mui-table-view-cell .mui-badge,.mui-table-view-chevron .mui-badge{ display: none;}
			.mui-grid-view.mui-grid-9 .mui-media .mui-icon{font-size:24px; color: #666;-webkit-text-stroke-width: 0.3px;}
			.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body{ font-size: 12px;}
			
			.mui-table-view .iconfont{ font-size: 20px;-webkit-text-stroke-width: 0.3px;}
			.table-view-iconlist .iconfont{margin-right: 5px;}
			
			.user-info{ padding: 37px 0 12px;background: #e3393c; color: #fff; text-align: center; margin-top: -1px; height: 205px;}
			.user-info img{ height: 70px; display:inline; border-radius: 100%;}
			.user-info h3{ font-size: 16px; margin: 3px 0; position:relative; z-index: 3; line-height: 22px;}
			.user-info ul{ position: relative;z-index: 2;}
			.user-info ul li{ list-style: none; width: 50%; float: left; padding: 0 5% 0 20%; text-align: center;}
			.user-info ul li:first-child{ padding: 0 20% 0 5%; position: relative; }
			.user-info ul li:first-child:after{content: '';position: absolute; right: 0; height: 20px;border-left: 1px solid #fff; bottom: 0;}
			.user-info ul li strong{font-size: 22px; font-weight: normal;}
			.user-info ul li p{ color: #fff; margin: 0;}
		
		</style>
	</head>

	<body>
		<div class="mui-content mui-scroll-wrapper" id="scrollDiv">
			<div class="mui-scroll">
				<div class="user-info">
					<img id="userPhoto" src="../images/default-photo.png" />
					<h3 id="account">未登录</h3>
					<ul class="mui-clearfix">
						<li id="showFavProduct">
							<strong id="FavoriteProduct">0</strong>
							<p>商品收藏</p>
						</li>
						<li id="showFavShop">
							<strong id="FavoriteShop">0</strong>
							<p>店铺收藏</p>
						</li>
					</ul>
				</div>
				
				<div  class="scroll-div2">
					
					<ul class="mui-table-view mui-table-view-chevron table-view-combine">
						<li class="mui-table-view-cell">
							<a class="mui-navigate-right" id="order_0" >
								<span class="view-more-text">查看全部订单</span>我的订单
							</a>
						</li>
					</ul>	
					<ul class="mui-table-view mui-grid-view mui-grid-9 orderNav">
						<li class="mui-table-view-cell mui-media " id="order_1" >
							<a>
								<span class="mui-icon iconfont icon-daifukuan"><span class="mui-badge" id="WaitingForPay"></span></span>
								<div class="mui-media-body">待付款</div>
							</a>
						</li>
						<li class="mui-table-view-cell mui-media " id="order_2"  >
							<a>
								<span class="mui-icon iconfont icon-daifahuo"><span class="mui-badge" id="WaitDelivery"></span></span>
								<div class="mui-media-body">待发货</div>
							</a>
						</li>
						<li class="mui-table-view-cell mui-media " id="order_3" >
							<a>
								<span class="mui-icon iconfont icon-daishouhuo"><span class="mui-badge" id="WaitingForRecieve"></span></span>
								<div class="mui-media-body">待收货</div>
							</a>
						</li>
						<li class="mui-table-view-cell mui-media " id="order_5" >
							<a>
								<span class="mui-icon iconfont icon-daipingjia"><span class="mui-badge" id="WaitingForComments"></span></span>
								<div class="mui-media-body">待评价</div>
							</a>
						</li>
						<li class="mui-table-view-cell mui-media " id="order_6" >
							<a>
								<span class="mui-icon iconfont icon-tuihuohuanhuo"><span class="mui-badge" id="WaitingForRefund"></span></span>
								<div class="mui-media-body">退款/退货</div>
							</a>
						</li>
					</ul>
					<ul class="mui-table-view mui-table-view-chevron table-view-iconlist">
						<li class="mui-table-view-cell">
							<a id="userIntegral" >
								<span class="mui-icon iconfont icon-jindou"></span>
								<span class="mui-badge mui-badge-danger" id="Integral"></span>我的金豆
							</a>
						</li>
						<li class="mui-table-view-cell">
							<a id="userCoupon" class="mui-navigate-right">
								<span class="mui-icon iconfont icon-youhuiquan"></span>
								<span class="mui-badge mui-badge-danger" id="Counpon"></span>我的优惠券
							</a>
						</li>
						
						<li class="mui-table-view-cell">
							<a id="address" class="mui-navigate-right"><span class="mui-icon iconfont icon-shouhuodizhi"></span>收货地址管理</a>
						</li>
						<!--<li class="mui-table-view-cell">
							<a id="jdRecharge" class="mui-navigate-right"><span class="mui-icon iconfont icon-jindou2x10"></span>金豆充值</a>
						</li>-->
						<li class="mui-table-view-cell">
							<a id="goCart" class="mui-navigate-right"><span class="mui-icon iconfont icon-youhuiquan"></span>儒牛卡充值</a>
						</li>
					</ul>
					
					<ul class="mui-table-view exit-box" style="margin-bottom: 20px; display: none;">
						<li class="mui-table-view-cell" style="text-align: center;">
							<a id='exit'>退出</a>
						</li>
					</ul>
					<a style="margin: 15px;" id='login' class="custom-btn">登录</a>
				</div>
			</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/app.js"></script>
		<script>
			var state={},
				userId,
				auths=null;
			var account = document.getElementById('account');
			var loginbtn=document.getElementById('login');
			(function($, doc) {
				$.init({
				pullRefresh : {
				    container:'#scrollDiv',
				    deceleration:0.0006,
				    down : {
						contentdown : "下拉可以刷新",
						contentover : "释放立即刷新",
						contentrefresh : "正在刷新...",
						callback :function(){
							setTimeout(function(){
								if(app.isLogin()){
									getUserData();
								}else{
									showLogin('/')
								}
								mui('#scrollDiv').pullRefresh().endPulldownToRefresh();
							},2000);
						}
				    }
				}
			});
				$.plusReady(function() {
					if(!app.isLogin()){
						account.addEventListener('tap',function(){
							showLogin('/');
						});
						
						loginbtn.addEventListener('tap',function(){
							window.scrollTo(0,0);
							showLogin('/');
						});
					}
					
					//全部订单
					doc.getElementById('order_0').addEventListener('tap',function(){
						showOrderList(0)
					})
					
					//代付款
					doc.getElementById('order_1').addEventListener('tap',function(){
						showOrderList(1)
					})
					
					//代发货
					doc.getElementById('order_2').addEventListener('tap',function(){
						showOrderList(2)
					})
					
					//代收货
					doc.getElementById('order_3').addEventListener('tap',function(){
						showOrderList(3)
					})
					
					//代评价
					doc.getElementById('order_5').addEventListener('tap',function(){
						showOrderList(5)
					})
					
					//退货
					doc.getElementById('order_6').addEventListener('tap',function(){
						if(app.isLogin()){
								mui.openWindow({
									id:'orderRefund-list.html',
									url:'../orderRefund-list.html',
									show: {
										autoShow:true,
										aniShow: 'pop-in'
									},
									waiting: {
										autoShow: false
									}
								});
							}else{
								showLogin('/');
							}
					})
					doc.getElementById('userCoupon').addEventListener('tap',function(){
						if(app.isLogin()){
							mui.openWindow({
								id:'user-coupon.html',
								url:'user-coupon.html',
								show: {
									autoShow:true,
									aniShow: 'pop-in'
								},
								waiting: {
									autoShow: false
								}
							});
						}else{
							showLogin('/');
						}
					});
					
					doc.getElementById('goCart').addEventListener('tap',function(){
						if(mui.os.ios){
							plus.runtime.openURL('http://new.rubulls.com/m-Wap/RubullCard/Index')
						}else{
							if(app.isLogin()){
								mui.openWindow({
									id:'user-recharge.html',
									url:'user-recharge.html',
									show: {
										autoShow:true,
										aniShow: 'pop-in'
									},
									waiting: {
										autoShow: false
									}
								});
							}else{
								showLogin('/');
							}
						}
						
						
					});
					
					doc.getElementById('address').addEventListener('tap',function(){
						if(app.isLogin()){
							mui.openWindow({
								id:'address.html',
								url:'address.html',
								show: {
									autoShow:true,
									aniShow: 'pop-in'
								},
								waiting: {
									autoShow: false
								}
							});
						}else{
							showLogin('/');
						}
					});
					
					doc.getElementById('showFavProduct').addEventListener('tap',function(){
						if(app.isLogin()){
							mui.openWindow({
								id:'user-favproduct.html',
								url:'user-favproduct.html',
								show: {
									autoShow:true,
									aniShow: 'pop-in'
								},
								waiting: {
									autoShow: false
								}
							});
						}else{
							showLogin('/');
						}
					});
					doc.getElementById('showFavShop').addEventListener('tap',function(){
						if(app.isLogin()){
							mui.openWindow({
								id:'user-favshop.html',
								url:'user-favshop.html',
								show: {
									autoShow:true,
									aniShow: 'pop-in'
								},
								waiting: {
									autoShow: false
								}
							});
						}else{
							showLogin('/');
						}
					});
//					doc.getElementById('jdRecharge').addEventListener('tap',function(){
//							mui.openWindow({
//							id:'user/jd-Recharge.html',
//							url:'jd-Recharge.html',
//							show: {
//								autoShow:true,
//								aniShow: 'pop-in'
//							},
//							waiting: {
//								autoShow: false
//							}
//						});
//					});
					
					setTimeout(function(){
						plus.oauth.getServices( function(services){
							auths = services;
						})
					},10000)
				});
			}(mui, document));
			
			document.addEventListener('updateData', function() {
				if(app.isLogin()){
					getUserData();
				}
				document.getElementById('scrollDiv').scrollTop=0;
			});
			
			function getUserData(){
				state = app.getState();
				account.innerText = state.account;
				document.getElementById('login').style.display='none';
				document.getElementsByClassName('exit-box')[0].style.display='block';
				userId=state.userId;
				mui.ajax(URL+'api/MemberOrder/GetOrderRefundList?applyDate=all&auditStatus=0&pageNo=1&pageSize=10&showtype=0',{
					dataType:'json',
					type:'get',
					timeout:10000,
		      		success:function(data){
//		      			console.log(JSON.stringify(data))
		      			//退货
							app.whichShow(data.pageInfo.TotalItems,'WaitingForRefund');
		      		}
	      		})

				mui.ajax(URL+'api/UserCenter/GetUser/'+userId,{
					dataType:'json',
					type:'get',
					timeout:10000,
					success:function(data){
						if(data.Success=='true'){
							app.whichShow(data.FavoriteProduct,'FavoriteProduct');
							app.whichShow(data.FavoriteShop,'FavoriteShop');
							app.whichShow(data.WaitingForPay,'WaitingForPay');
							app.whichShow(data.WaitingForComments,'WaitingForComments');
							
							app.whichShow(data.WaitDelivery,"WaitDelivery");
							app.whichShow(data.WaitingForRecieve,'WaitingForRecieve');
							app.whichShow(data.Counpon,'Counpon');
							app.whichShow(data.Balance,'Integral');
							//console.log(data.);
							var userPhoto=data.Photo;
							if(userPhoto=='')
								userPhoto='../images/default-photo.png';
							else
								document.getElementById('userPhoto').src=userPhoto;
						}
					}
				});
			}
			
			function showOrderList(id){
				if(app.isLogin()){
					mui.openWindow({
						id:'order-list.html',
						url:'../order-list.html',
						extras:{
							orderStatus:id
					    },
						show: {
							autoShow:true,
							aniShow: 'pop-in'
						},
						waiting: {
							autoShow: false
						}
					});
				}else{
					showLogin('/');
				}
			}
			
			//退出操作
			function backUser(){
				mui.ajax(URL+'api/Login/PostLogout',{
					dataType:'json',
					contentType:'application/json',
					type:'POST',
					timeout:10000,
					success:function(data){
						if(data.Success=="true"){
							for ( var i in auths ) {
								var s = auths[i];
								if ( s.authResult ) {
									s.logout(function(e){
										plus.nativeUI.toast( "注销登录成功！" );
									}, function(e){
										plus.nativeUI.toast( "注销登录失败！" );
									});
								}
							}
							app.setState({});
							plus.webview.currentWebview().reload();
						}
					},
					error:function(xhr,type,errorThrown){
						plus.nativeUI.toast('退出登录失败，请检查网络')
					}
				});
			}
			
			document.getElementById('exit').addEventListener('tap', function() {
				if (mui.os.ios) {
					backUser();
					return;
				}
				var btnArray = [{
					title: "注销当前账号"
				}, {
					title: "直接关闭应用"
				}];
				plus.nativeUI.actionSheet({
					cancel: "取消",
					buttons: btnArray
				}, function(event) {
					var index = event.index;
					switch (index) {
						case 1:
							backUser();
							break;
						case 2:
							plus.runtime.quit();
							break;
					}
				});
			}, false);
			
		</script>
	</body>

</html>